<template>
	<view>
		<view class="xinguan-view" v-for="item in list" :key="item._id">
			<text class="name">{{ item.name }}</text>
			<view class="xinguan-order">
				<text>接种地点:</text>
				<text>{{ item.address }}</text>
			</view>
			<view class="xinguan-order">
				<text>疫苗厂商:</text>
				<text>{{ item.company }}</text>
			</view>
			<view class="xinguan-order">
				<text>接种时间:</text>
				<text>{{ item.date }} {{ item.period }}</text>
			</view>
			<!-- 取消预约 -->
			<view class="reg-cancel">
				<text @click="go(item._id)" v-if="item.cancel">是否取消预约</text>
				<text v-else class="prevent_style">已取消预约</text>
			</view>
		</view>
		<nullList name="没有预约的数据" v-if="list.length===0"></nullList>
		<view style="height:200rpx"></view>
	</view>
</template>

<script>
	import {
		coviduserorder,
		covidcancel
	} from "../../utils/API/vaccineorder";
	import nullList from "../../components/nullList/nullList.vue"
	export default {
		components: {
			nullList
		},
		data() {

			return {
				list: []
			};
		},
		mounted() {
			this.xuan()
		},
		methods: {
			async xuan() {
				let {
					data
				} = await coviduserorder()
				this.list = data;
			},
			async go(id) {
				wx.showModal({
					title: '提示',
					content: '是否取消预约',
					success(res) {
						if (res.confirm) {
							covidcancel(id)
							console.log('用户点击确定')
						} else if (res.cancel) {
							console.log('用户点击取消')
						}
					}
				})
				await this.xuan()
			},

		}
	}
</script>

<style lang="scss">
	@import "/static/common-style/vaccine.css";
</style>
